import { defineConfig, loadEnv } from "vite";
import { viteMockServe } from "vite-plugin-mock";
import { visualizer } from "rollup-plugin-visualizer";
import type { UserConfig, ConfigEnv } from "vite";
import { fileURLToPath } from "url";
import AutoImport from "unplugin-auto-import/vite";
import Icons from "unplugin-icons/vite";
import Components from "unplugin-vue-components/vite";
import IconsResolver from "unplugin-icons/resolver";
import ElementPlus from "unplugin-element-plus/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import vue from "@vitejs/plugin-vue";
import vueJsx from "@vitejs/plugin-vue-jsx";
export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
    // 获取当前工作目录
    const root = process.cwd();
    // 获取环境变量
    const env = loadEnv(mode, root);
    console.log(env);
    return {
        // 项目根目录
        root,
        // 项目部署的基础路径
        base: "./",
        // base: "http://www.xxx.cdn.com",
        publicDir: fileURLToPath(new URL("./public", import.meta.url)), // 无需处理的静态资源位置
        assetsInclude: fileURLToPath(new URL("./src/assets", import.meta.url)), // 需要处理的静态资源位置
        plugins: [
            // Vue模板文件编译插件
            vue(),
            // jsx文件编译插件
            vueJsx(),
            // 开启mock服务器
            viteMockServe({
                // 如果接口为 /mock/xxx 以 mock 开头就会被拦截响应配置的内容
                mockPath: "mock", // 数据模拟需要拦截的请求起始 URL
                enable: true, // 本地环境是否开启 mock 功能
            }),
            // 开启ElementPlus自动引入CSS
            ElementPlus({}),
            // 自动引入组件及ICON
            AutoImport({
                resolvers: [IconsResolver(), ElementPlusResolver()],
                dts: fileURLToPath(
                    new URL("./types/auto-imports.d.ts", import.meta.url),
                ),
            }),
            // 自动注册组件
            Components({
                resolvers: [IconsResolver(), ElementPlusResolver()],
                dts: fileURLToPath(
                    new URL("./types/components.d.ts", import.meta.url),
                ),
                dirs: [
                    fileURLToPath(new URL("./src/components", import.meta.url)),
                ],
            }),
            // 自动安装图标
            Icons({
                autoInstall: true,
            }),
        ],
        // 运行后本地预览的服务器
        server: {
            // 是否开启https
            // https: false,
            // 指定服务器应该监听哪个 IP 地址。 如果将此设置为 0.0.0.0 或者 true 将监听所有地址，包括局域网和公网地址。
            host: true,
            // 开发环境预览服务器端口
            port: 9000,
            // 启动后是否自动打开浏览器
            open: false,
            // 是否开启CORS跨域
            cors: true,
            // 代理服务器
            // 帮助我们开发时解决跨域问题
            proxy: {
                // 这里的意思是 以/api开头发送的请求都会被转发到 http://xxx:9000
                [env.VITE_APP_API_BASEURL]: {
                    target: "http://localhost:9000",
                    // 改变 Host Header
                    changeOrigin: true,
                    // 发起请求时将 '/api' 替换为 ''
                    rewrite: (path) => path.replace(/^\/api/, ""),
                },
                [env.VITE_APP_MOCK_BASEURL]: {
                    target: "http://localhost:9001",
                    // 改变 Host Header
                    changeOrigin: true,
                    // 发起请求时将 '/api' 替换为 ''
                    rewrite: (path) => path.replace(/^\/api/, ""),
                },
            },
        },
        // 打包配置
        build: {
            // 关闭 sorcemap 报错不会映射到源码
            sourcemap: false,
            assetsDir: "static", // 静态资源打包目录
            assetsInlineLimit: 1024 * 20, // 超过这个大小的文件会被打包成单独的文件
            // 打包大小超出 4000kb 提示警告
            chunkSizeWarningLimit: 4000,
            rollupOptions: {
                // plugins: [visualizer({ open: true })],
                // 打包入口文件 根目录下的 index.html
                // 也就是项目从哪个文件开始打包
                input: {
                    index: fileURLToPath(
                        new URL("./index.html", import.meta.url),
                    ),
                },
                // treeshake: {
                //     preset: "smallest",
                // },
                // experimentalLogSideEffects: true,
                // 静态资源分类打包
                output: {
                    experimentalMinChunkSize: 50 * 1024,
                    manualChunks: (id: string) => {
                        if (id.includes("node_modules")) {
                            return "vendor";
                        }
                        // if (id.includes("src/views/about/")) {
                        //     return "about.vue"; // this name can be defined by yourself
                        // }
                        // if (id.includes("src/views/auth/")) {
                        //     return "about.vue"; // this name can be defined by yourself
                        // }
                        // if (id.includes("src/views/login/")) {
                        //     return "login.vue"; // this name can be defined by yourself
                        // }
                        return "index";
                    },
                    // format: "esm",
                    // chunkFileNames: "static/js/chunk-[hash].js", // 代码分割后的文件名
                    // entryFileNames: "static/js/[name]-[hash:6].js", // 打包的文件名
                    // assetFileNames: "static/[ext]/asset-[hash].[ext]", // 资源文件的文件名
                },
            },
        },
        // 配置别名
        resolve: {
            alias: {
                "@": fileURLToPath(new URL("./src", import.meta.url)),
                "#": fileURLToPath(new URL("./types", import.meta.url)),
            },
        },
    };
});
